<template>
    <div>
        <van-form ref="registerForm">
            <span class="field_title">姓名</span>
            <van-field
                    v-model="name"
                    label=""
                    placeholder="请输入您的姓名"
                    clearable
                    :rules="[{ required: true, message: '' }]"
            >
            </van-field>
            <!--<span class="field_title">身份证</span>
            <van-field
                    v-model="username"
                    label=""
                    placeholder="请输入身份证号码"
                    clearable
            />-->
           <!-- <span class="field_title">用户身份</span>
            <div class="roleDiv">
                <van-radio-group v-model="radio" direction="horizontal">
                    <van-radio name="1" shape="square">医生</van-radio>
                    <van-radio name="2" shape="square">护士</van-radio>
                    <van-radio name="3" shape="square">医师</van-radio>
                    <van-radio name="4" shape="square">药师</van-radio>
                    <van-radio name="5" shape="square">其他</van-radio>
                </van-radio-group>
            </div>-->

            <span class="field_title">邀请码</span>
            <van-field
                    v-model="recommenedcode"
                    label=""
                    placeholder="请输入邀请码"
                    clearable
            />
            <span class="field_title">身份证号</span>
            <van-field
                    v-model="idcard"
                    label=""
                    placeholder="请输入身份证号"
                    clearable
                    :rules="[{ required: true, message: '' }]"
            />
            <!--<span class="field_title">上传护士证第1，2页</span>
            <div style="display: flex;padding: 15px;">
                <van-uploader v-model="fileList1" :after-read="afterRead1" upload-icon="plus" multiple :max-count="2"/>
            </div>
            <span class="field_title">上传身份证正面</span>
            <div style="display: flex;padding: 15px;">
                <van-uploader v-model="fileList2" :after-read="afterRead2" upload-icon="plus"  :max-count="1"/>
            </div>
            <span class="field_title">上传身份证反面</span>
            <div style="display: flex;padding: 15px;">
                <van-uploader v-model="fileList3" :after-read="afterRead3" upload-icon="plus"  :max-count="1"/>
            </div>-->


            <div style="margin: 16px;text-align: center;">
                <van-button round block type="info" native-type="submit" v-if="!isSubmit" @click="handleRegister"  class="btn">立 即 提 交</van-button>
                <van-loading type="spinner" color="#1989fa" v-else/>
            </div>
        </van-form>
    </div>
</template>

<script>
    import {addInfo} from '@/api/login';
    import {upload_info_nurse,upload_idcard,upload_idcard_back} from '@/api/user'
    import axios from 'axios'
    import {Toast} from 'vant'
    import {identityIdCard} from '@/utils/validate'
    export default {
        name: "registerIndex",
        data(){
            return {
                userLoginInfo: undefined,
                isSubmit: false,
                radio: '1',
                name: undefined,
                recommenedcode: undefined,
                idcard: undefined,
                fileList: [
                    /*{
                        url: 'https://img01.yzcdn.cn/vant/leaf.jpg',
                        status: 'uploading',
                        message: '上传中...',
                    },*/
                    /*{
                        url: 'https://img01.yzcdn.cn/vant/tree.jpg',
                        status: 'failed',
                        message: '上传失败',
                    },*/
                    /*{
                        url: 'https://img01.yzcdn.cn/vant/tree.jpg',
                        status: 'success',
                        message: '上传成功',
                    },*/
                ],
                fileList1: [],
                fileList2: [],
                fileList3: [],
            }
        },
        methods: {
            handleRegister(){
                console.log(this.fileList1.length);
                this.$refs.registerForm.validate().then(()=>{
                   /* console.log("开始验证证件信息..............");
                    if(this.fileList1.length == 0 || this.fileList1.length == 1){
                        return Toast('请补充护士证信息')
                    }
                    if(this.fileList2.length == 0 || this.fileList3.length == 0){
                        return Toast('请补充身份证信息')
                    }*/
                    let isIdcard = identityIdCard(this.idcard);
                    if(! isIdcard){
                        return Toast("身份证格式有误");
                    }
                    // 验证通过
                    console.log("验证通过");
                    let data = {
                        idCard: this.idcard,
                        name: this.name,
                        recommenedcode: this.recommenedcode
                    }
                    console.log(data);
                    addInfo(data).then(response => {
                        console.log("添加信息返回：",response);
                        if(response.code == 0){
                            // 存token
                            this.setToken(this.userLoginInfo.token);
                            this.$router.push("/");
                        }else if(data.code == 280002){
                            Toast(data.msg);
                        }
                    }).catch((error) => {
                        if(error) console.log(error)
                    });
                    /*const headers = {
                        'Content-Type': 'application/json;charset=utf-8',
                        'token': this.userLoginInfo.token
                    }

                    let url = this.requestUrl+"/h5protal/user/add_info";
                    console.log("完善信息访问地址：",url);
                    axios.post(url, data, {
                        headers: headers
                    }).then((response) => {
                        console.log("添加信息返回：",response);
                        let data = response.data;
                        if(data.code == 0){
                            // 存token
                            this.setToken(this.userLoginInfo.token);
                            this.$router.push("/");
                        }else if(data.code == 280002){
                            Toast(data.msg);
                        }

                    }).catch((error) => {
                       if(error) console.log(error)
                    })*/
                }).catch(()=>{
                    //验证失败
                    console.log("验证失败");
                    return this.dialogNotifyError("请补充信息之后再提交");
                })
            },
            afterRead1(file) {
                file.status = 'uploading';
                file.message = '上传中...';

                /*setTimeout(() => {
                    file.status = 'failed';
                    file.message = '上传失败';
                }, 1000);*/
                console.log("file文件信息",file.file);
                console.log("文件列表：",this.fileList1);
                // 此时可以自行将文件上传至服务器
                let formData = new FormData();
                if (file.constructor != Array) {
                    console.log("不是数组");
                    console.log(file.file);
                    formData.append("file", file.file);
                    console.log(formData);
                } else {
                    console.log("是数组");
                    file.forEach(element => {
                        formData.append("file", element.file);
                    });
                }
                upload_info_nurse(this.userLoginInfo.userId,formData).then(response=>{
                    console.log(response);
                    file.status = 'success';
                    file.message = '上传成功';
                }).catch(err=>{
                    console.log(err);
                    file.status = 'failed';
                    file.message = '上传失败';
                })


            },
            afterRead2(file) { // 身份证正面
                file.status = 'uploading';
                file.message = '上传中...';
                /*setTimeout(() => {
                    file.status = 'failed';
                    file.message = '上传失败';
                }, 1000);*/
                console.log("file文件信息",file.file);
                console.log("文件列表：",this.fileList1);
                // 此时可以自行将文件上传至服务器
                let formData = new FormData();
                if (file.constructor != Array) {
                    console.log("不是数组");
                    console.log(file.file);
                    formData.append("file", file.file);
                    console.log(formData);
                } else {
                    console.log("是数组");
                    file.forEach(element => {
                        formData.append("file", element.file);
                    });
                }
                upload_idcard(this.userLoginInfo.userId,formData).then(response=>{
                    console.log(response);
                    file.status = 'success';
                    file.message = '上传成功';
                }).catch(err=>{
                    console.log(err);
                    file.status = 'failed';
                    file.message = '上传失败';
                })
            },
            afterRead3(file) { // 身份证正面
                file.status = 'uploading';
                file.message = '上传中...';
                /*setTimeout(() => {
                    file.status = 'failed';
                    file.message = '上传失败';
                }, 1000);*/
                console.log("file文件信息",file.file);
                console.log("文件列表：",this.fileList1);
                // 此时可以自行将文件上传至服务器
                let formData = new FormData();
                if (file.constructor != Array) {
                    console.log("不是数组");
                    console.log(file.file);
                    formData.append("file", file.file);
                    console.log(formData);
                } else {
                    console.log("是数组");
                    file.forEach(element => {
                        formData.append("file", element.file);
                    });
                }
                upload_idcard_back(this.userLoginInfo.userId,formData).then(response=>{
                    console.log(response);
                    file.status = 'success';
                    file.message = '上传成功';
                }).catch(err=>{
                    console.log(err);
                    file.status = 'failed';
                    file.message = '上传失败';
                })
            },
        },
        created(){
            if(this.$route.params.data)
                this.userLoginInfo = JSON.parse(this.$route.params.data);
            let recommendCode = localStorage.getItem("recommendCode");
            if(recommendCode != "null"){
                this.recommenedcode = recommendCode;
            }
        }
    }
</script>

<style scoped>
    .roleDiv{padding: 15px;}
    .field_title{display:block;text-align: left;padding: 15px 15px 0px 15px;}
    .btn{background: #CCCCCC;border: none;border-radius: 0px;color: black;}
</style>
